<template>
  <div>
    <el-dialog title="预约" :visible.sync="visible" width="30%">
      <el-form
        :model="fromData"
        status-icon
        ref="dataForm"
        label-width="100px"
        class="demo-ruleForm"
      >
        <el-form-item label="研究室名称:">
          <span>{{ room.name }}</span>
        </el-form-item>
        <el-form-item label="预约日期:">
          <span>{{ fromData.resDate }}</span>
        </el-form-item>
        <el-form-item label="预约时间:">
          <span>{{ fromData.orderstart }} - {{ fromData.orderend }}</span>
        </el-form-item>
        <el-form-item label="讨论主题" prop="title">
          <el-input v-model="fromData.title"></el-input>
        </el-form-item>
        <el-form-item label="预约人数" prop="number">
          <el-input v-model.number="fromData.number"></el-input>
        </el-form-item>
        <el-form-item label="讨论内容" prop="content">
          <el-input type="textarea" :rows="2" v-model="fromData.content"></el-input>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button size="small" @click="visible = false">取 消</el-button>
        <el-button :loading="loading" size="small" type="primary" @click="submitForm()">
          确 定
        </el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import request from '@/req'
export default {
  data() {
    return {
      visible: false,
      fromData: {
        id: '',
        readerId: this.$getUser() ? this.$getUser().uid : '',
        title: '',
        content: '',
        number: '',
        orderstart: '',
        orderend: '',
        libId: '',
        floorId: '',
        resDate: '',
        roomId: '',
      },
      room: {},
      loading: false,
    }
  },
  methods: {
    openDia(room, resDate, orderstart, orderend) {
      this.room = { ...room }
      this.fromData.id = ''
      this.visible = true
      this.$nextTick(() => {
        this.$refs['dataForm'].resetFields()
        this.fromData.resDate = resDate
        this.fromData.orderstart = orderstart
        this.fromData.orderend = orderend
        this.fromData.libId = room.libId
        this.fromData.floorId = room.floorId
        this.fromData.roomId = room.id
      })
    },
    submitForm() {
      this.loading = true
      request.post('/seminarRes/addReservation', this.fromData).then((res) => {
        this.loading = false
        if (res.code == 200) {
          this.visible = false
          this.$message({
            type: 'success',
            message: '预约成功',
          })
        } else {
          this.$message({
            type: 'warning',
            message: res.msg,
          })
        }
      })
    },
  },
}
</script>

<style scoped></style>
